<template>
    <view>
 
        <!--列表-->
        <view v-if="_list.length > 0">
            <view class="white mb-10 px-24 py-28" v-for="(item, index) in _list" :key="index">
                <navigator :url="'/pages/user/xiangmuxiangqing?id='+item.id+'&api='+props.apiName+'&keytype='+props.keytype">
                    <view class="text-size-g text-weight-b text-overflow-2">
                    {{ item.title }}
                </view>
                <view class="mt-24 flex flex-row flex-row-center-start flex-wrap" style="gap:24rpx 32rpx;">
                    <view v-for="(item2,index2) in item.tag_arr" :key="index2" class="c_textlist flex flex-center "
                    :style="{background:item2.color}"
                    ><text>{{ item2.text }}</text></view>
                </view>
                <view v-if="(item?.intro??false)" class="mt-24 text-overflow-2 text-size-m c_wenhui">
                    {{ item.intro }}
                </view>
                <view class="mt-24 flex flex-row flex-row-center-start">
                    <view class="flex flex-row flex-row-center-start">
                        <tm-icon :font-size="24" name="tmicon-user-fill" color="#0073FF"></tm-icon>
                        <view class="c_kd text-size-m text-blue ml-21 text-overflow-1">{{ item.realname }}</view>
                    </view>
                    <view v-if="item?.amount" class="flex flex-row flex-row-center-start ml-50">
                        <tm-icon :font-size="24" name="tmicon-transanction" color="#EA7D10"></tm-icon>
                        <text class="text-size-m c_txtchuang ml-21">{{ item.amount }}</text>
                    </view>
                </view>
                </navigator>
                <view @click="collectDetail(item.id)" class="mt-22 c_ckbg "> 
                    <view class="flex flex-row flex-row-center-center">
                        <view class="text-size-m text-red">取消收藏</view>
                    </view>
                </view>
                <view class="pt-20 text-size-s c_qianhui">发布时间：{{ item.created_at }}</view>
            </view>
        </view>


    </view>
</template>
<script setup lang="ts">
import { watchEffect } from 'vue';
import { PropType, computed,ref } from 'vue';
import {apiUr} from "@/libs/api"
const emits = defineEmits(["update"])
const props = defineProps({

    list: {
        type: Array as PropType<any[]>,
        default: () => []
    },
    apiName:{
        type:String,
        default:""
    },
    keytype:{
        type:String,
        default:""
    }
})

const _list = computed(()=>props.list)



async function collectDetail(id:string){
	uni.showLoading({title:"取消中",mask:true});
	await apiUr.collectDetail(id,props.keytype);
	emits('update')
}

</script>

<style>
.c_textlist {
    border-radius: 6rpx;
    color: #ffffff;
    font-size: 26rpx;
    padding: 8rpx 16rpx;
}

.c_ckbg {
    background: #F7F7F7;
    width: 702rpx;
    height: 70rpx;
    line-height: 70rpx;
    border-radius: 16rpx;
    
}

.c_kd {
    width: 248rpx;
}
</style>